<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                template="../../resources/plantilla/VentanaPrincipalPlantilla.xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                xmlns:f="http://java.sun.com/jsf/core">
    <style>
        .jjj{
            height: 1000px;

        }
    </style>
    <ui:define  name="formulario">
        <div class="panelTitulo">
            REGISTRO DE USUARIO
        </div> 
        <div style=" height: 1000px;width: 90%; margin-left: 5%; float: left;">
            <h:form id="UsuarioRegistro">


                <p:panel header="Información personal" footer="La Informacion Ingresa debe ser veridica" style="border: none; background-color:#FAFAFA; " >
                    <div style="font-size: 1.8em; color:steelblue; margin-top: 10px; margin-bottom: 10px;">
                        Primera vez en Semptac? Registrate y  a las ofertas de trabajo:
                    </div> 
                    <p:growl id="mensaje" showDetail="true" life="3000"/> 
                    <p:fieldset legend="Datos Personales" style="margin-bottom:10px;">
                        <h:panelGrid columns="4" 
                                     border="0" 
                                     cellspacing="4" 
                                     cellpadding="0" 
                                     columnClasses="column1Class, column2Class,column3Class,column4Class" 
                                     rendered="#{usuarioController.selected != null}">
                            <p:outputLabel value="#{bundleEtiquetasES.TipoIdientidad}" for="tipoIdentidad" />
                            <p:selectOneMenu id="tipoIdentidad" 
                                             style="width: 240px;"
                                             value="#{usuarioController.selected.tipoIdentidad}"
                                             required="true" 
                                             requiredMessage="#{bundleEtiquetasES.TipoIdientidad}  #{bundleEtiquetasES.CampoRequerido}">                          
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Seleccione}" itemValue="-"/>
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Cedula}" itemValue="C" />  
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Ruc}" itemValue="R" />
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Pasaporte}" itemValue="P" />

                                <p:ajax event="change" 
                                        listener="#{usuarioController.validaTipoIdentidad()}"
                                        update="identidad"/>
                            </p:selectOneMenu>  

                            <p:outputLabel value="#{bundleEtiquetasES.Identidad}" for="identidad" />
                            <p:inputText id="identidad" 
                                         disabled="#{usuarioController.selected.tipoIdentidad==null}"
                                         styleClass="inputText" 
                                         value="#{usuarioController.selected.identidad}" 
                                         title="#{bundleEtiquetasES.Identidad}"
                                         required="true" 
                                         requiredMessage="#{bundleEtiquetasES.Identidad} #{bundleEtiquetasES.CampoRequerido}" >
                                <p:ajax event="blur" 
                                        listener="#{usuarioController.validadIdentidad()}"/>
                            </p:inputText>

                            <p:outputLabel value="#{bundleEtiquetasES.Nombres}" for="nombres" />
                            <p:inputText id="nombres" 

                                         styleClass="inputText" 

                                         value="#{usuarioController.selected.nombres}" 
                                         title="#{bundleEtiquetasES.Nombres}"
                                         required="true" 
                                         requiredMessage="#{bundleEtiquetasES.Nombres} #{bundleEtiquetasES.CampoRequerido}" />

                            <p:outputLabel value="#{bundleEtiquetasES.Apellidos}" for="apellidos" />
                            <p:inputText id="apellidos" 
                                         styleClass="inputText" 
                                         value="#{usuarioController.selected.apellidos}" 
                                         title="#{bundleEtiquetasES.Apellidos}" />
                            <p:outputLabel value="#{bundleEtiquetasES.FechaNacimiento}" for="fechaNacimiento" />
                            <p:calendar id="fechaNacimiento" 
                                        value="#{usuarioController.selected.fechaNacimiento}" 
                                        locale="de"
                                        navigator="true"
                                        size="42"

                                        pattern="dd/MM/yyyy" 
                                        title="#{bundleEtiquetasES.FechaNacimiento}" 
                                        required="true" 
                                        requiredMessage="#{bundleEtiquetasES.FechaNacimiento} #{bundleEtiquetasES.CampoRequerido}" 
                                        maxdate="#{usuarioController.FMaxima}"
                                        />

                        </h:panelGrid>
                    </p:fieldset>
                    <p:fieldset legend="Datos Acesso al Sistema" style="margin-bottom:10px">
                        <h:panelGrid columns="4" 
                                     border="0" 
                                     cellspacing="4" 
                                     cellpadding="0" 
                                     columnClasses="column1Class, column2Class,column3Class,column4Class" 
                                     rendered="#{usuarioController.selected != null}">
                            <p:outputLabel value="#{bundleEtiquetasES.UserName}" for="username" />
                            <p:inputText id="username" 
                                         style="width: 230px; height: 15px;"
                                         value="#{usuarioController.selected.username}" 
                                         title="#{bundleEtiquetasES.UserName}" 
                                         required="true" 
                                         requiredMessage="#{bundleEtiquetasES.UserName} #{bundleEtiquetasES.CampoRequerido}">
                                <p:ajax event="blur" 
                                        listener="#{usuarioController.validarUsername()}" 
                                        update=":UsuarioCreateForm:mensaje"/>
                            </p:inputText>
                            <p:outputLabel value="#{bundleEtiquetasES.Contrasena}" for="contrasena" />
                            <p:password id="contrasena" 
                                        value="#{usuarioController.contrasena}" 
                                        title="#{bundleEtiquetasES.Contrasena}" 
                                        style="width: 230px; height: 15px;"
                                        required="true" 
                                        requiredMessage="#{bundleEtiquetasES.Contrasena} #{bundleEtiquetasES.CampoRequerido}">
                                <p:ajax event="blur" 
                                        listener="#{usuarioController.validarContrasena()}"
                                        update=":UsuarioRegistro:mensaje, confirmarContrasena"/>
                            </p:password>

                            <p:outputLabel value="#{bundleEtiquetasES.ConfirmeContrasena}" for="confirmarContrasena" />
                            <p:password id="confirmarContrasena" 
                                        value="#{usuarioController.confirmaContrasena}" 
                                        title="#{bundleEtiquetasES.Contrasena}" 
                                        required="true" 
                                        style="width: 230px; height: 15px;"
                                        requiredMessage="#{bundleEtiquetasES.Contrasena} #{bundleEtiquetasES.CampoRequerido}">
                                <p:ajax event="blur" 
                                        listener="#{usuarioController.validarConfirmacionContrasena()}" 
                                        update=":UsuarioRegistro:mensaje"
                                        />
                            </p:password>
                            <p:outputLabel value="#{bundleEtiquetasES.CorreoElectronico}" for="correoElectronico" />
                            <p:inputText id="correoElectronico" 
                                         value="#{usuarioController.selected.correoElectronico}" 
                                         title="#{bundleEtiquetasES.CorreoElectronico}" 
                                         required="true" 
                                         style="width: 230px; height: 15px;"
                                         requiredMessage="#{bundleEtiquetasES.CorreoElectronico} #{bundleEtiquetasES.CampoRequerido}">
                                <p:ajax event="blur" 
                                        listener="#{usuarioController.revisaisMail()}" 
                                        update=":UsuarioCreateForm:mensaje"/>
                            </p:inputText>

                        </h:panelGrid>
                    </p:fieldset>
                    <p:fieldset legend="Informacion de Domicilio" style="margin-bottom:10px">
                        <h:panelGrid columns="4" 
                                     border="0" 
                                     cellspacing="4" 
                                     cellpadding="0" 
                                     columnClasses="column1Class, column2Class,column3Class,column4Class" 
                                     rendered="#{usuarioController.selected != null}">
                            <p:outputLabel value="#{bundleEtiquetasES.Pais}" for="pais" />
                            <p:selectOneMenu id="pais" 
                                             value="#{usuarioController.pais}"
                                             required="true" 
                                             style="width: 240px;"
                                             requiredMessage="#{bundleEtiquetasES.Pais} #{bundleEtiquetasES.CampoRequerido}">
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Seleccione}"/>
                                <f:selectItems value="#{usuarioController.itemPaises}"
                                               var="PaisItem"
                                               itemValue="#{PaisItem}"
                                               itemLabel="#{PaisItem.nombre}"
                                               />
                                <f:converter binding="#{paisConverter}"/>
                                <p:ajax event="change" 
                                        listener="#{usuarioController.selectPais()}" 
                                        update=":UsuarioRegistro:mensaje, provincia,ciudad"/>
                            </p:selectOneMenu>

                            <p:outputLabel value="#{bundleEtiquetasES.Provincia}" for="provincia" />
                            <p:selectOneMenu id="provincia" 
                                             value="#{usuarioController.provincia}"
                                             required="true" 
                                             style="width: 240px;"

                                             requiredMessage="#{bundleEtiquetasES.Pais} #{bundleEtiquetasES.CampoRequerido}">
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Seleccione}"/>
                                <f:selectItems value="#{usuarioController.itemProvincias}"
                                               var="ProvinciaItem"
                                               itemValue="#{ProvinciaItem}"
                                               itemLabel="#{ProvinciaItem.nombre}"
                                               />
                                <f:converter binding="#{regionConverter}"/>
                                <p:ajax event="change" 
                                        listener="#{usuarioController.selectProvincia()}" 
                                        update=":UsuarioRegistro:mensaje, ciudad"/>
                            </p:selectOneMenu>



                            <p:outputLabel value="#{bundleEtiquetasES.Ciudad}/CANTON" for="ciudad" />
                            <p:selectOneMenu id="ciudad" 
                                             value="#{usuarioController.selected.idCiudad}"
                                             required="true" 
                                             style="width: 240px;"
                                             requiredMessage="#{bundleEtiquetasES.Pais} #{bundleEtiquetasES.CampoRequerido}">
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Seleccione}"/>
                                <f:selectItems value="#{usuarioController.itemCiudades}"
                                               var="CiudadItem"
                                               itemValue="#{CiudadItem}"
                                               itemLabel="#{CiudadItem.nombre}"
                                               />
                                <f:converter binding="#{ciudadConverter}"/>
                            </p:selectOneMenu>
                            <p:outputLabel value="#{bundleEtiquetasES.EstadoCivil}"   for="estadoCivil" />
                            <p:selectOneMenu id="estadoCivil" 
                                             value="#{usuarioController.selected.estadoCivil}"
                                             required="true" 
                                             style="width: 240px;"
                                             requiredMessage="#{bundleEtiquetasES.EstadoCivil} - #{bundleEtiquetasES.CampoRequerido}">
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Seleccione}"/>
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Soltero}" itemValue="S" />  
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Casado}" itemValue="C" />
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Divorciado}" itemValue="D" />
                                <f:selectItem itemLabel="#{bundleEtiquetasES.UnionLibre}" itemValue="U" />
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Viudo}" itemValue="V" />  
                            </p:selectOneMenu>
                            <p:outputLabel value="#{bundleEtiquetasES.Direccion}" for="direccion" />
                            <p:inputText id="direccion" 
                                         styleClass="inputText" 
                                         value="#{usuarioController.selected.direccion}" 
                                         title="#{bundleEtiquetasES.Direccion}" 
                                         required="true" 
                                         requiredMessage="#{bundleEtiquetasES.Direccion} #{bundleEtiquetasES.CampoRequerido}">
                                <p:watermark for="direccion" value="Barrio, Calle 1, Calle 2, Num"/>
                            </p:inputText>



                            <p:outputLabel value="#{bundleEtiquetasES.Disponibilidad}" for="disponibilidad" />
                            <p:selectOneMenu id="disponibilidad" 
                                             value="#{usuarioController.selected.disponibilidad}"
                                             required="true" 
                                             style="width: 240px;"
                                             requiredMessage="#{bundleEtiquetasES.EstadoCivil} - #{bundleEtiquetasES.CampoRequerido}">
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Seleccione}"/>
                                <f:selectItem itemLabel="#{bundleEtiquetasES.TiempoCompleto}" itemValue="C" />  
                                <f:selectItem itemLabel="#{bundleEtiquetasES.MedioTiempo}" itemValue="M" />
                                <f:selectItem itemLabel="#{bundleEtiquetasES.Otro}" itemValue="O" />  
                            </p:selectOneMenu>
                        </h:panelGrid>
                    </p:fieldset>
                    <p:fieldset legend="Informacion de Interes" style="margin-bottom:10px">
                        <h:panelGrid columns="2" 
                                     border="0" 
                                     cellspacing="10" 
                                     cellpadding="10" 
                                     rendered="#{usuarioController.selected != null}">
                            <div style=" color: #0000cc; width: 80%; margin: auto;">
                                Si deseas Registrate como un Empleado que requiere buscar trabajo como Pasante, entonces haz clic en SI
                            </div>
                            <p:selectOneButton id="pasante"
                                               style="width: 200px!important;"
                                               value="#{usuarioController.selected.tipo}"
                                               required="true">
                                <f:selectItem  itemLabel="NO"   itemEscaped=""  itemValue="U"/>
                                <f:selectItem itemLabel="SI" itemValue="P"/>
                            </p:selectOneButton>
                        </h:panelGrid>
                    </p:fieldset>

                    <div style=" width: 25%; margin: auto;  margin-top: 20px;">
                        <p:commandButton actionListener="#{usuarioController.create}" value="REGISTRAR" icon="ui-icon-disk" update=":UsuarioRegistro:mensaje"/>
                        <p:commandButton value="CANCELAR" icon="ui-icon-closethick"/>
                    </div>


                </p:panel>
                <p:panel id="basic" header="SUSCRIPCION EN SERVIVIOS EMPLEOS Y TALENTOS"  style=" margin-top: 20px;margin-bottom:20px; border: none;">
                    <h:panelGrid columns="1" cellpadding="10">
                        <h:outputText
                            value="* En la fecha de nacimiento si no aparece el año de nacimiento, seleccionar el año mas cercano y luego nuevamente vuelva a repetir el proceso hasta encontrar el anno correspondiente :" style="font-weight: bold; color: #0480be ; text-align: center"/>
                        
                    </h:panelGrid>
                </p:panel>
            </h:form>
        </div>
    </ui:define>
</ui:composition>
